/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
import pxToDp from '../config/pxToDp'
import {
    StyleSheet,
    Text,
    View,
    Image,
    TouchableWithoutFeedback,
} from 'react-native';




export default class FriendInfoScene extends Component {
    constructor(props){
        super(props)

    }
    render() {
        return (
            <View style={styles.all_view}>
                <View style={styles.big_view}>
                    <View style={styles.small_view_touxiang}>
                        <View style={styles.contentChild}>
                            <Image style={styles.img_touxiang} source={{uri:this.props.navigation.state.params.headsmall}}/>
                            <View style={styles.xinxi}>
                                <View style={styles.xingbie_view}>
                                    <Text style={styles.text}>{this.props.navigation.state.params.nickname}</Text>
                                    <Image  style={styles.xingbie} source={require('../imgs/性别女.png')}></Image>
                                </View>
                                <Text style={styles.text2}>随聊号：{this.props.navigation.state.params.friendId}</Text>
                                <Text style={styles.text2}>昵称：{this.props.navigation.state.params.remark}</Text>
                            </View>
                        </View>
                    </View>
                </View>
                <View style={styles.small_view_other}>
                     <View style={styles.contentChild2}>
                    <Text style={styles.text3} >设置备注跟标签</Text>
                     </View>
                </View>
                <View style={styles.big_view3}>
                    <View style={styles.big_view2}>
                        <View style={styles.contentChild3}>
                            <Text style={styles.text3} >地区</Text>
                            <Text style={styles.text4} >深圳</Text>
                        </View>
                    </View>

                    <View style={styles.big_view4}>
                        <View style={styles.contentChild3}>
                            <Text style={styles.text3} >个人相册</Text>
                            <Image style={styles.img_xiangce} source={require('../imgs/pic.jpg')}/>
                            <Image style={styles.img_xiangce2} source={require('../imgs/pic.jpg')}/>
                            <Image style={styles.img_xiangce2} source={require('../imgs/pic.jpg')}/>
                        </View>
                    </View>

                    <View style={styles.big_view5}>
                        <View style={styles.contentChild3}>
                            <Text style={styles.text3} >个性签名</Text>
                            <Text style={styles.text5} >你想一夜暴富么，你想资产过亿么？</Text>
                        </View>
                    </View>
                </View>
                <TouchableWithoutFeedback
                    onPress={()=>{
                        this.props.navigation.navigate('chatScene', {
                            friendUid: this.props.navigation.state.params.friendId,
                            friendPic: this.props.navigation.state.params.headsmall,
                            friendName: this.props.navigation.state.params.remark,
                        })
                    }}
                >
                    <View style={styles.button1}>
                        <View style={styles.view_text_button1}>
                            <Text style={styles.text_button1}>发消息</Text>
                        </View>
                    </View>
                </TouchableWithoutFeedback>
                

                {/* <View style={styles.button1}>
                    <View style={styles.view_text_button2}>
                        <Text style={styles.text_button2}>视频消息</Text>
                    </View>
                </View> */}
            </View>

        );
    }
}

const styles = StyleSheet.create({



    xingbie:{
        marginTop:pxToDp(4),
        marginLeft:pxToDp(15),
        height:pxToDp(25),
        width:pxToDp(25),
        //justifyContent:"center",
    } ,

    xingbie_view:{
        flexDirection:"row",
    },

    button1:{
      marginTop:pxToDp(30),
        alignSelf:"center",

    },

    xinxi:{
        marginTop:pxToDp(20),
        marginLeft:pxToDp(30)

    },


    //头像
    contentChild:{
        //justifyContent:"space-between",
        flexDirection:'row',//view内的内容横着排列
        height:pxToDp(160),

    },

    contentChild2:{
        justifyContent:"center",
        marginLeft:pxToDp(30)
    },


    contentChild3:{
        alignSelf:"center",
        //justifyContent:"space-between",
        flexDirection:'row',//view内的内容横着排列
        //marginLeft:pxToDp(30),

    },


    //头像的view
     small_view_touxiang:{
         paddingRight: pxToDp(380),
         paddingLeft: pxToDp(25),

     },
    //其他信息的view
    small_view_other:{
       flexDirection:"row",
        backgroundColor:'#ffffff',
        marginTop:pxToDp(33),
        height:pxToDp(80),

    },

    big_view2:{
        flexDirection:"row",
        backgroundColor:'#ffffff',
        height:pxToDp(80),
        borderBottomWidth:1,
        borderColor:'#dfdfdf',
        justifyContent:"space-between",
        marginLeft:pxToDp(30),
        marginRight:pxToDp(30),


    },

    big_view4:{
        flexDirection:"row",
        backgroundColor:'#ffffff',
        height:pxToDp(150),
        borderBottomWidth:1,
        borderColor:'#dfdfdf',
        justifyContent:"space-between",
        marginLeft:pxToDp(30),
        marginRight:pxToDp(30),


    },

    big_view5:{
        flexDirection:"row",
        backgroundColor:'#ffffff',
        height:pxToDp(80),

        justifyContent:"space-between",
        marginLeft:pxToDp(30),
        marginRight:pxToDp(30),


    },

    //总的viwe
     all_view:{
         flex:1,
         backgroundColor:'#ebebeb',
       },

    //总view里面的大view
    big_view:{
        marginTop:pxToDp(40),
        backgroundColor:'#ffffff',
    },


    big_view3:{
        marginTop:pxToDp(40),
        backgroundColor:'#ffffff',
    },

    //字体
    text: {

        //alignSelf:'center',
       // fontSize: pxToDp(28),
        color:'#343434',

    },

    text2:{

        //alignSelf:'center',
        //fontSize: pxToDp(22),
        color:'#888785',
        marginTop:pxToDp(3),
    },

    text3: {

        //fontSize: pxToDp(28),
        color:'#343434',


    },

    text4: {
        //fontSize: pxToDp(22),
        color:'#888785',
        marginLeft:pxToDp(100),

    },

    text5: {
        //fontSize: pxToDp(28),
        color:'#343434',
        marginLeft:pxToDp(50)


    },

    text_button1:{
        //fontSize: pxToDp(32),
         color:"#ffffff",
        //justifyContent:"center",
        alignSelf:"center",
        marginLeft:pxToDp(250),

    },

    text_button2:{
        //fontSize: pxToDp(32),

        //justifyContent:"center",
        alignSelf:"center",
        marginLeft:pxToDp(240),

    },
    view_text_button1:{
        flexDirection:"row",
        borderRadius:pxToDp(6),
        height:pxToDp(85),
        width:pxToDp(580),
        backgroundColor:"#1aac19",
    },

    view_text_button2:{
        flexDirection:"row",
        borderRadius:pxToDp(6),
        height:pxToDp(85),
        width:pxToDp(580),
        backgroundColor:"#ffffff",
    },

    //头像图片
    img_touxiang:{
        height:pxToDp(120),
        width:pxToDp(120),
        alignSelf:'center'
    },
    //头像图片
    img_xiangce:{
        height:pxToDp(110),
        width:pxToDp(110),
        alignSelf:'center',
        marginLeft:pxToDp(50),
    },

    img_xiangce2:{
        height:pxToDp(110),
        width:pxToDp(110),
        alignSelf:'center',
        marginLeft:pxToDp(10),
    },


});

